import React, {Component} from 'react';
import {Form} from "antd";
import DebounceSelect from './index'
class Demo extends Component {
    fetchList = (value) =>{
        console.log('fetching...', value);
        return fetch('https://randomuser.me/api/?results=5')
            .then((response) => response.json())
            .then((body) =>
                body.results.map((user) => ({
                    label: `${user.name.first} ${user.name.last}`,
                    value: user.login.username,
                })),
            );
    }
    render() {
        return (
            <Form>
                <Form.Item label={'demo'} name={'dome'}>
                    <DebounceSelect
                        showSearch
                        placeholder="输入关键字查询"
                        fetchOptions={this.fetchList}
                        onChange={(newValue) => {
                            console.log(newValue)
                        }}
                        style={{
                            width: '100%',
                        }}
                    />
                </Form.Item>
            </Form>
        );
    }
}

export default Demo;
